<script lang="ts" setup>
import { ref, reactive, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import { UserEditUrl } from "@/views/org/mapping.json";
import UserForm from "./component/user-form.vue";
import UserDeptList from "@/views/org/user-dept/component/user-dept-list.vue";
import { redirectPath } from "@/utils/router-kit";
import { InputBean, messageSuccessTip, messageWarnTip } from "@whjxtech/jxtech-component";
import userBeanServiceApi from "@/api/modules/org/bean/user-bean";
const route = useRoute();
const router = useRouter();
const UserFormRef = ref<InstanceType<typeof UserForm> | null>(null);
const UserDeptListRef = ref<InstanceType<typeof UserDeptList> | null>(null);
const UserFormState = reactive({
  // 用户ID
  userId: router.currentRoute.value.params.id as string,
  // 部门ID
  unitId: router.currentRoute.value.query.unitId as string,
  // userId: route.query.userId as string,
  // unitId: route.query.unitId as string,
  onSaveButtonClick: () => {
    //UserFormRef.value.save();
    UserFormRef.value.validate().then((valid: boolean) => {
      if (!valid) {
        messageWarnTip("请先填写表单必填项");
        return;
      }
      let status: "update" | "insert" = UserFormState.userId ? "update" : "insert";

      const formData = UserFormRef.value.getFormData();
      const inputBaen = UserDeptListRef.value.getInputBean() as InputBean;
      if (status === "insert" && (!inputBaen.insert || inputBaen.insert.length === 0)) {
        messageWarnTip("新增用户必须存在一个部门");
        return;
      }

      userBeanServiceApi.saveMasterDetail(status, formData, inputBaen).then(res => {
        if (status === "insert") {
          messageSuccessTip("数据新增成功");
        } else {
          messageSuccessTip("数据修改成功");
        }
        redirectPath(UserEditUrl + formData.userId, {
          unitId: route.query.unitId as string,
          orgId: formData.orgId
        });
      });
    });
  },
  /**质量验收卡新增成功 跳转页面 */
  onAddFormSuccess: (formData: any) => {
    redirectPath(UserEditUrl + formData.userId, {
      unitId: route.query.unitId as string,
      orgId: formData.orgId
    });
  },
  //加载用户部门表格
  loadUserDeptTable: () => {
    //const userDeptPageTableRef = .getUserDeptPageTableRef() as IPageTableExpose
    UserDeptListRef.value.loadTable();
  }
});

onMounted(() => {
  if (UserFormState.userId) UserFormState.loadUserDeptTable();
});
</script>
<template>
  <jxtech-basic-card title="基本信息">
    <template #operationSpace>
      <jxtech-save-button @click="UserFormState.onSaveButtonClick" v-auth="'org:qxgl:zzyyh:save'"> </jxtech-save-button>
      <JxtechBackButtonExt></JxtechBackButtonExt>
    </template>
    <el-alert
      v-if="!UserFormState.userId"
      title="用户密码提示"
      class="jxtech-item-mb"
      type="success"
      description="用户密码必须由大写，小写字母以及数字三种字符组成，且长度为8-15之间"
      show-icon
    ></el-alert>
    <user-form
      ref="UserFormRef"
      :user-id="UserFormState.userId"
      :unit-id="UserFormState.unitId"
      @add-success="UserFormState.onAddFormSuccess"
    >
    </user-form>
    <user-dept-list
      ref="UserDeptListRef"
      :user-id="UserFormState.userId"
      :unit-id="UserFormState.unitId"
      v-auth="'org:qxgl:zzyyh:save'"
    >
    </user-dept-list>
    <!-- <template v-if="UserFormState.userId">
      
    </template> -->
  </jxtech-basic-card>
</template>
